{include file="public/layout" /}
<body class="laytp-container">
<!--
本「综合演示」包含：自定义头部工具栏、获取表格数据、表格重载、自定义模板、单双行显示、单元格编辑、自定义底部分页栏、表格相关事件与操作、与其他组件的结合等相对常用的功能，以便快速掌握 table 组件的使用。
-->

<div id="search-form">
  <form class="layui-form layui-row layui-col-space16 layui-search-admin">

  </form>

</div>
<div class="layui-card">
  <div class="layui-card-body">
    <table class="layui-hide" id="test" lay-filter="test"></table>
  </div>
</div>
<script type="text/html" id="toolbarDemo">
  <div class="layui-btn-container">
    <button class="layui-btn layui-btn-sm" onclick="add()">
        添加
    </button>
    <button class="layui-btn layui-btn-sm" onclick="reload()">
      刷新数据
    </button>


  </div>
</script>
<script type="text/html" id="barDemo">
  <div class="layui-clear-space">
    <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
    <a class="layui-btn layui-btn-xs" lay-event="del">删除</a>

  </div>
</script>
<script>
  var tableIns
  var datawhere = {};
  layui.use(function(){
    var table = layui.table;
    var dropdown = layui.dropdown;
    var laydate = layui.laydate;
    var form = layui.form;

    // 创建渲染实例
    tableIns = table.render({
      elem: '#test',
      url:'{:url("index")}', // 此处为静态模拟数据，实际使用时需换成真实接口
      toolbar: '#toolbarDemo',
      defaultToolbar: ['filter'],
      height: 'full-200', // 最大高度减去其他容器已占有的高度差
      css: [ // 重设当前表格样式
        '.layui-table-tool-temp{padding-right: 145px;}'
      ].join(''),
      cellMinWidth: 80,
      totalRow: false, // 开启合计行
      page: true,
      pagebar: '#test-pagebar', // 分页栏模板
      cols: [[
        {type: 'checkbox', fixed: 'left'},
        {field:'id', fixed: 'left', width:80, title: 'ID', sort: true},
        {field:'title', title: '标题'},
        {field:'tome', title:'转账类型',  width:150,templet:function(d){
            if(d.tome==0){
              return '转给他人';
            }else if(d.status==1){
              return '转给自己';
            }
          }},
        {field:'changebl', title: '转换比例'},
        {field:'fee', title: '手续费'},
        {field:'max',  title: '最大值'},
        {field:'min',  title: '最小值'},
        {field:'status', title:'管理人', width: 100,templet:function(d){
            if(d.status==0){
              return '<span style="color: red;">关闭</span>';
            }else if(d.status==1){
              return '<span style="color: green;">开启</span>';
            }
          }},
        {fixed: 'right', title:'操作', width: 134, minWidth: 125, templet:function (d) {
            var html = '';
            html += '<a class="layui-btn layui-btn-xs" onclick="edit('+d.id+')">编辑</a>';
            html += '<a class="layui-btn layui-btn-xs" onclick="del('+d.id+')">删除</a>';
            return html;
          }}
      ]],
      error: function(res, msg){
        console.log(res, msg)
      }
    });

    // 触发单元格工具事件
    table.on('tool(test)', function(obj){ // 双击 toolDouble
      var data = obj.data; // 获得当前行数据
    });

    laydate.render({
      elem: '.demo-table-search-date'
    });
    laydate.render({
      elem: '#laydate-rangeLinked',
      type: 'datetime',
      range: ['#table-search-date-start', '#table-search-date-end'],
      rangeLinked: true // 开启日期范围选择时的区间联动标注模式 ---  2.8+ 新增
    });
    // 搜索提交
    form.on('submit(demo-table-search)', function(data){
      var field = data.field; // 获得表单字段
      datawhere = field;
      // 执行搜索重载
      table.reload('test', {
        page: {
          curr: 1 // 重新从第 1 页开始
        },
        where: field // 搜索的字段
      });
      //layer.msg('搜索成功<br>此处为静态模拟数据，实际使用时换成真实接口即可');
      return false; // 阻止默认 form 跳转
    });
  });
  function add(){
    layer.open({
      title: '添加',
      type: 2,
      shadeClose: true,
      area: ['100%','100%'],
      scrollbar:false,
      content: '{:url("edit")}'
    });
  }
  function edit(id){
    layer.open({
      title: '添加',
      type: 2,
      shadeClose: true,
      area: ['100%','100%'],
      scrollbar:false,
      content: '/admin/TransferSet/edit/id/'+id
    });
  }
  function reload(){
    layui.table.reload('test', {
      where: {
        abc: 123,
        test: '新的 test1'
      },
      // scrollPos: 'fixed',  // 保持滚动条位置不变 - v2.7.3 新增
      // height: 2000, // 测试无效参数（即与数据无关的参数设置无效，此处以 height 设置无效为例）
      //url: '404',
      //page: {curr: 1, limit: 30} // 重新指向分页
    }, true);
  }
  function del(id){
    layer.confirm('真的删除行 [id: '+id +'] 么', function(index){
      $.ajax({
        type: "POST",
        url: "{:url('del')}",
        data: {id:id},
        success: function(res){
          console.log(res);
          if(res.status){
            layer.msg('提交成功');
          }else{
            layer.msg(res.msg);
          }
          layer.close(index);
          tableIns.reload()
        }
      });
      layer.close(index);
      // 向服务端发送删除指令
    });
  }
  function excel(){

  }
</script>
</body>
</html>